import GameConfig = Phaser.Types.Core.GameConfig;
import Phaser from 'phaser';
class MyScene extends Phaser.Scene {
  private plateforms!: Phaser.Physics.Arcade.StaticGroup;
  private player!: Phaser.Types.Physics.Arcade.SpriteWithDynamicBody;
  private cursors!: Phaser.Types.Input.Keyboard.CursorKeys;
  private stars!: Phaser.Physics.Arcade.Group;
  private bombs!: Phaser.Physics.Arcade.Group;
  private scoreText!: Phaser.GameObjects.Text;
  constructor(config: GameConfig) {
    super(config);
  }
  public preload(): void {
    this.load.image('sky', require('@/assets/img/game/first/sky.png'));
    this.load.image('star', require('@/assets/img/game/first/star.png'));
    this.load.image('bomb', require('@/assets/img/game/first/bomb.png'));
    this.load.image('platform', require('@/assets/img/game/first/platform.png'));
    this.load.spritesheet('dude', require('@/assets/img/game/first/dude.png'), { frameWidth: 32, frameHeight: 48 });
  }

  public create(): void {
    this.add.image(400, 300, 'sky');
    this.plateforms = this.physics.add.staticGroup();
    this.plateforms.create(400, 568, 'platform').setScale(2).refreshBody();
    this.plateforms.create(600, 400, 'platform');
    this.plateforms.create(50, 250, 'platform');
    this.plateforms.create(750, 220, 'platform');

    this.player = this.physics.add.sprite(100, 450, 'dude');
    this.player.setBounce(0.2);
    this.player.setCollideWorldBounds(true);

    this.anims.create({
      key: 'left',
      frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
      frameRate: 10,
      repeat: -1,
    });
    this.anims.create({
      key: 'turn',
      frames: [{ key: 'dude', frame: 4 }],
      frameRate: 20,
    });
    this.anims.create({
      key: 'right',
      frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
      frameRate: 10,
      repeat: -1,
    });
    this.cursors = this.input.keyboard.createCursorKeys();
    this.stars = this.physics.add.group({
      key: 'star',
      repeat: 11,
      setXY: { x: 12, y: 0, stepX: 70 },
    });
    this.stars.children.iterate( (child: any)  => {
      child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
    });
    this.bombs = this.physics.add.group();


    this.scoreText = this.add.text(16, 16, 'Score:0', { fontSize: '32px', color: '#000' });

    this.physics.add.collider(this.player, this.plateforms);
    this.physics.add.collider(this.stars, this.plateforms);
    this.physics.add.collider(this.bombs, this.plateforms);
  }
  public update(time: number): void {
    if (this.cursors.left) {
    }
  }

}
export class MyGame {
  private readonly gameConfig!: GameConfig;
  private game!: Phaser.Game;
  constructor(dom: string) {
    this.gameConfig = {
      width: 800,
      type: Phaser.AUTO,
      height: 600,
      backgroundColor: '#FFFFFF',
      parent: dom,
      physics: {
        default: 'arcade',
        arcade: {
          gravity: { y: 300 },
          debug: false,
        },
      },
    };
    this.init();
  }
  private init() {
    this.game = new Phaser.Game(this.gameConfig);
    const scene = new MyScene(this.gameConfig);
    this.game.scene.add('default', scene);
    this.game.scene.run('default');
  }
}
